<template>
  <div class="product-add">
    <!--form表单-->
    <el-form size="small" ref="form" :model="form" label-width="200px">
      <!--店员修改-->
      <div class="common-form">配送详情</div>
      <el-form-item label="订单编号">
        <a @click="addClick(form.order.order_id)">{{ form.order.order_no }}</a>
      </el-form-item>
      <el-form-item label="仓库名称">
        {{ form.store.store_name }}
      </el-form-item>
      <el-form-item label="仓库地址">
        {{ form.store.address }}
      </el-form-item>
      <el-form-item label="仓库电话">
        {{ form.store.phone }}
      </el-form-item>
      <el-form-item label="配送员姓名">
        {{ form.storeClerk.real_name }}
      </el-form-item>
      <el-form-item label="配送员电话">
        {{ form.storeClerk.mobile }}
      </el-form-item>
      <el-form-item label="取货图片" v-if="form.image" v-viewer>
        <el-row>
          <template v-for="item in image">
            <img :src="item" width="100" height="100" class="mt10"/>
          </template>
        </el-row>
      </el-form-item>
      <div class="common-button-wrapper">
        <el-button size="small" type="info" @click="cancelFunc">取消</el-button>
      </div>
    </el-form>
  </div>
</template>

<script>
import ProductClaimApi from '@/api/productClerk.js';

export default {
  components: {},
  data() {
    return {
      form: {},
      loading: false,
      image: [],
    };
  },
  created() {
    if (this.$route.query.id != 0 && this.$route.query.id != undefined) {
      this.form.id = this.$route.query.id;
      this.getParams()
    }
  },

  methods: {
    getParams() {
      let self = this;
      // 取到路由带过来的参数
      ProductClaimApi.edit({
        id: self.form.id
      }, true)
        .then(data => {
          // 将数据放在当前组件的数据内
          self.form = data.data;
          if (data.data.image != '' && data.data.image != undefined) {
            self.image = data.data.image.split(',');
          }
        })
        .catch(error => {

        });

    },
    /*取消*/
    cancelFunc() {
      this.$router.back(-1);
    },
    addClick(order_id) {
      let self = this;
      let params = order_id;
      self.$router.push({
        path: '/order/order/Detail',
        query: {
          order_id: params
        }
      });
    },

  }

};
</script>

<style lang="scss" scoped>
.basic-setting-content {
}

.product-add {
  padding-bottom: 50px;
}
</style>
